$.fn.stickyElem = function(){

  var thead = this.prop('tagName') == 'THEAD'; // check if element is THEAD

  var posit = this.offset().top; // get element's position
  var jq_obj = this;           // store jquery object 
  var scroll;

  // if element is thead, store widths of td and th elements
  if (thead) {
    var tbodyWidths = [];
    var theadWidths = [];
    this.next().children().children('td').each(function() {
    tbodyWidths.push($(this).width()); });

    this.children().children('th').each(function() {
    theadWidths.push($(this).width()); });

    var ctr = 0; // initialize counter variable
  }

  $(window).scroll(function(event) {     // as user scrolls down
    scroll = $(window).scrollTop();

    if (scroll >= posit) {   // if user scrolls down at or below element's position
      jq_obj.css('position', 'fixed');   // make element fixed on top of page
      jq_obj.css('z-index', '10');
      jq_obj.css('top', '0px');
        
      if (thead) {                     // if element is a thead element
        // adjust table's margin-top property
        jq_obj.parent().css('margin-top', jq_obj.height());
        // and make sure the th and td elements have the same 
        // widths as the initial static table
        jq_obj.next().children().children('td').each(function() {
        $(this).width(tbodyWidths[ctr++]); });
        ctr = 0;
      
        jq_obj.children().children('th').each(function() {
        $(this).width(theadWidths[ctr++]); });
        ctr = 0;
          
      }
    }
    
    else {        // if user scrolls back up, return elelemnt to its initial static position
      jq_obj.css('position', 'static');
      jq_obj.css('z-index', '0');
          
      if (thead) jq_obj.parent().css('margin-top', '0px');
    }
  }); 

};